// components/EntrustPopup/index.js
import { areaList } from '@vant/area-data'
import { getUserInfoApi } from '../../api/user'
import { isEmail, isMobile } from '../../utils/validate'
/**
 * 委托信息弹窗组件
 */
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    hasTabBar: {
      type: Boolean,
      value: false
    }
  },

  /**
   * 组件的初始数据
   */
  data: {
    entrustShow: false, // 委托信息弹窗展示状态
    areaShow: false, // 城市选择弹窗展示状态
    areaList,
    areaValue: '',
    userName: '', // 联系人
    phone: '', // 电话
    delegateUnitName: '', // 委托单位名称
    delegateUnitProvince: '', // 省
    delegateUnitCity: '', // 市
    delegateUnitArea: '', // 区
    delegateUnitAddress: '', // 委托单位地址
    payUnitAddress: '', // 付款单位名称
    email: '' // 联系邮箱
  },

  /**
   * 组件的方法列表
   */
  methods: {
    async getUserInfo() {
      const [err, userInfo] = await getUserInfoApi()
      if (err) return
      const {
        delegateUnitAddress,
        delegateUnitArea,
        delegateUnitCity,
        delegateUnitName,
        delegateUnitProvince,
        email,
        payUnitAddress,
        phone,
        userName
      } = userInfo
      this.setData(
        {
          delegateUnitAddress,
          delegateUnitArea,
          delegateUnitCity,
          delegateUnitName,
          delegateUnitProvince,
          email,
          payUnitAddress,
          phone,
          userName
        },
        () => {
          this.getAreaValue()
        }
      )
    },

    getAreaValue() {
      const area = this.data.delegateUnitArea
      let areaValue = ''
      for (const key in areaList.county_list) {
        if (Object.hasOwnProperty.call(areaList.county_list, key)) {
          const value = areaList.county_list[key]
          if (value === area) {
            areaValue = key
            break
          }
        }
      }
      this.setData({
        areaValue
      })
    },

    showPopup() {
      this.setData({ entrustShow: true })
    },

    onClose() {
      this.setData({ entrustShow: false })
    },

    areaConfirm(e) {
      const value = e.detail.values
      this.setData({
        areaValue: value[2].code,
        delegateUnitProvince: value[0].name,
        delegateUnitCity: value[1].name,
        delegateUnitArea: value[2].name,
        areaShow: false
      })
    },

    areaCancel() {
      const instance = this.selectComponent('.area')
      instance.reset(this.data.areaValue)
      this.setData({
        areaShow: false
      })
    },

    showArea() {
      this.setData({
        areaShow: true
      })
    },

    jumpComnfirmPage() {
      const {
        userName,
        phone,
        delegateUnitName,
        payUnitAddress,
        email,
        delegateUnitAddress,
        delegateUnitProvince,
        delegateUnitCity,
        delegateUnitArea
      } = this.data
      const isRequired = [
        userName,
        phone,
        delegateUnitName,
        payUnitAddress,
        email,
        delegateUnitProvince,
        delegateUnitCity,
        delegateUnitArea,
        delegateUnitAddress
      ].some((item) => !item || item === '')

      if (isRequired) {
        wx.showToast({
          title: '请完善委托信息',
          icon: 'none'
        })
        return
      }

      if (!isMobile(phone)) {
        wx.showToast({
          title: '手机号格式验证失败',
          icon: 'none'
        })
        return
      }

      if (!isEmail(email)) {
        wx.showToast({
          title: '邮箱格式验证失败',
          icon: 'none'
        })
        return
      }

      const delegateVO = {
        userName,
        phone,
        delegateUnitName,
        delegateUnitAddress,
        payUnitAddress,
        delegateUnitProvince,
        delegateUnitCity,
        delegateUnitArea,
        email,
        remark: ''
      }
      wx.setStorageSync('delegateVO', delegateVO)
      this.triggerEvent('sureBtnClick', delegateVO)
    }
  },
  lifetimes: {
    attached() {
      this.getUserInfo()
    }
  }
})
